Las tablas en HTML se utilizan para organizar información de manera estructurada en filas y columnas. Aunque son más utilizadas para mostrar datos tabulares, también pueden ser útiles para organizar ciertos tipos de contenido en la web.
A continuación, exploraremos las etiquetas más importantes relacionadas con tablas y cómo se utilizan en HTML.
| Etiqueta | Descripción | Ejemplo |
|---|---|---|
| <table> | Define el inicio de una tabla. | <table>...</table> |
| <tr> | Define una fila en una tabla. | <tr>...</tr> |
| <td> | Define una celda de datos dentro de una fila. | <td>Celda</td> |
| <th> | Define una celda de encabezado. | <th>Encabezado</th> |
| <caption> | Agrega un título a la tabla. | <caption>Título</caption> |
| Atributo | Descripción | Ejemplo |
|---|---|---|
| border | Agrega un borde a la tabla. | <table border="1"> |
| cellpadding | Define el espaciado dentro de una celda. | <table cellpadding="5"> |
| cellspacing | Define el espaciado entre celdas. | <table cellspacing="10"> |
| colspan | Permite que una celda se extienda por varias columnas. | <td colspan="2"> |
| rowspan | Permite que una celda se extienda por varias filas. | <td rowspan="3"> |
A continuación, un ejemplo completo de una tabla con encabezados, celdas combinadas y varios atributos aplicados:
| Estudiante | Asignatura | Nota |
|---|---|---|
| María López | Matemáticas | 90 |
| Historia | 85 | |
| Juan Pérez | Exento | |